property childNodes บน IE และ Firefox นั้นคืนค่าไม่เหมือนกัน เนื่องจากบน Firefox จะทำการคืนค่าทุก Node ที่เป็นโหนดลูก แต่บน IE จะทำการคืนค่าเฉพาะ Node ลำดับเดียวกันเท่านั้น ทำให้ไม่สามารถใช้ property นี้ได้อย่างสมบูรณ์แบบ ลองดูตัวอย่างนี้

<dl id="test">
   <dd><span>000</span><span>111</span></dd>
</dl>
<input type="button" value="Demo" onclick="alert( document.getElementById('test').childNodes.length )" />

ลองใช้ Firfox หรือ IE คลิกดูตัวอย่างกันเอานะครับ


การแก้ปัญหา สามารถทำได้โดยเลี่ยงไปใช้ getElementsByTagName('*') แทนครับ

<dl id="test">
   <dd><span>000</span><span>111</span></dd>
</dl>
<input type="button" value="Demo" onclick="alert( document.getElementById('test').getElementsByTagName('*').length )" />

วิธีการนี้จะทำให้ ทั้ง IE และ Firefox คืนค่าออกมาเหมือนๆกัน โดยคืนค่าทุกๆ tag ที่เป็น โหนดลูก